這裡先說 方向錯了 就是會繞了一圈 不過 你也會懂很多東西
先看 我們的 model.js
export const MyBoxData = Immutable.fromJS({
MyBoxList: []
});
有一個重點 我們是用 Immutable 去管理我們的資料 我原本一直找 react redux array object 的方法
但這是有問題的 因為我後來讀完文件 Immutable 自己有自己的一招
其實 這個我應該早就要發現 因為我在拿他的東西 都是要用 state.get(....), 跟一些範例的直接 object 存取是完全不一樣的
話不多說 來看最後成功版本~
Action 部分
export const SetIsIns = (_myboxcount, _compid, _userid, _discid, _subjid, _isins, _token) => {
var formData = new FormData();
formData.append("token", _token);
formData.append("CompID", _compid);
formData.append("UserID", _userid);
formData.append("DiscID", _discid);
formData.append("SubjID", _subjid);
formData.append("IsIns", _isins);
return (dispatch) => {
fetch("http://xxx.xxx.xxx/subj/set_subj_is_ins", {
method: "POST",
body: formData
})
.then(function(response) {
return response.json();
})
.then(function(jsonData) {
// 修改mybox 項目
// 修改mybox 數字
let _currentMyBoxCount = _isins == 0 ? (_myboxcount - 1) : (_myboxcount + 1)
if (jsonData.result) {
// 更新數字
dispatch({
type: Update_MyBox_Number,
payload: {
MyBoxCount: _currentMyBoxCount
}
});
// 更新項目
dispatch({
type: Update_MyBox_Item_Visible,
payload: {
DiscID: _discid,
SubjID: _subjid,
IsIns: _isins
}
});
} else {
// 伺服器動作異常
}
})
.catch(function(e) {
console.log(e);
})
}
}
reducer 部分
Update_MyBox_Item_Visible: (state, {payload}) => {
return state.map((_mybox_item, _mybox_index) => {
if (_mybox_index === "MyBoxList") {
// MyBoxLst
return _mybox_item.map((_disc_item, _disc_index) => {
// console.log(_disc_item.getIn([0, 'DiscID']) === payload.DiscID);
if (_disc_item.getIn([0, 'DiscID']) === payload.DiscID) {
return _disc_item.map((_subj_item, _subj_index) => {
if (_subj_item.get('SubjID') === payload.SubjID) {
return _subj_item.set('Visible', payload.IsIns);
}
return _subj_item;
});
return _disc_item;
}
return _disc_item;
});
return _mybox_item;
}
});
}
其實 Immutable 就是要你自己進去到那一層 然後很直覺的 set 給他就可以了
然後 你沒有要動的那幾個 map item 就原封不動的 return 回去就可以了
終於完成了 ~ 明天希望就可以把列表的事情結束~